<!DOCTYPE html>
<html>

<head>
    <meta charset="utf-8">
    <meta name="description"content="{{site.description}}">
    <meta name="keywords" content="{{site.keywords}}"/>
    <meta property="og:title" content="{{site.title}}" />
    <meta property="og:description" content="{{site.description}}" />
     <title>{{article.title}}-{{site.name}}</title>
  {{include './common/meta.html'}}
</head>

<body>

  <!-- 头部 -->
  {{include './common/header.html'}}


    <!-- 内容 -->
 <!-- 头条文章 -->
 <main class="bg-f2f2f2 pt-10 pb-20 row">

    <div class="main w-1200 center mt-10 row gap-20">
        <!-- 最新文章 -->
        <article class="article-index">
            <div class="bg-fff radius-6 pd-15 mb-1 f-14 c-999">
                <i class="ico-20 ico-home pos-r t-3"></i>
                <a class="" href="" target="_blank">首页</a> /
                {{each position}}
                    {{if $index < position.length-1}} <a href="{{$value.path}}/index.html">{{$value.name}}</a> /
                        {{else}}
                        <a class="c-666" href="{{$value.path}}/index.html">{{$value.name}}</a>
                        {{/if}}
                        {{/each}}
            </div>
            <div class="bg-fff radius-6 pd-25">
                <header class="border-b pos-r">
                    <h2 class="f-26 c-252933  bold mt-10">{{article.title}}</h2>
                    <p class="f-12 c-999 mt-5 mb-26">
                        <span>
                            <i class="ico-20 ico-time pos-r t-4"></i>  {{dateFormat(article.createdAt, 'YYYY-MM-DD')}}
                            <i class="ico-20 ico-admin pos-r t-4 ml-4"></i> {{article.author}}
                            <i class="ico-20 ico-view pos-r t-5 ml-4"></i> 阅读（{{article.pv}}）
                        </span>
                    </p>
                </header>
                {{if article.description}}
                <section class="introduction pd-10 border-6 mb-20 mt-20 lh-25 f-14 bg-f2f2f2">
                    「导读」{{@ article.description}}
                </section>
                {{/if}}
                <article id="article" class="article-cont f-17 lh-35">
                    {{@ article.content}}
                </article>
            </div>

            <footer class="pd-25 bg-fff radius-6 mt-1 f-14 c-333">
                <p>上一篇：
                    {{if pre}}
                    <a href="{{pre.path}}/article-{{pre.id}}.html" class="c-666">
                        {{pre.title}}
                    </a>
                    {{else}}
                    真的没有了
                    {{/if}}
                </p>
                <p class="mt-14">下一篇：
                    {{if next}}
                    <a href="{{next.path}}/article-{{next.id}}.html" class="c-666">
                        {{next.title}}
                    </a>
                    {{else}}
                    真的没有了
                    {{/if}}
                </p>
            </footer>

        </article>

        <aside class="flex-1">

            <!-- 最新 -->
            <section class="notices pd-20 mb-20 bg-fff">
                <h3 class="m-aside-title border-dashed f-16 row justify-between">最新文章
                </h3>
                <ul class="mt-10">
                    {{each news}}
                    <li class="f-14 pt-4 pb-4 row justify-between">
                        <a href="{{$value.path}}/article-{{$value.id}}.html" title="{{$value.title}}">
                            {{$value.title}}
                        </a>
                    </li>
                    {{/each}}
                </ul>
            </section>


           <!-- 图文 热门 -->
           <section class="notices pd-20 mb-20 bg-fff">
            <h3 class="m-title border-dashed f-16 row justify-between">推荐图文</h3>
            {{each imgs}}
            <figure class="row justify-between mt-10 ">
                {{if $value.img}}
                <div class="thumb mb-10">
                    <img class="w-p100" src="{{$value.img}}" alt="{{$value.title}}" title="{{$value.title}}">
                </div>
                {{/if}}
                <div class="flex-1">
                    <figcaption class="f-18 ellips-2 bold mt-4">{{$value.title}}</figcaption>
                    <p class="f-14 ellips-3">
                        {{@ $value.description}}
                        <a href="{{$value.path}}/article-{{$value.id}}.html" title="{{$value.title}}">详情
                        </a>
                    </p>
                </div>
            </figure>
            {{/each}}
        </section>


             <!-- tag标签 -->
            <!-- <section class="notices pd-20 mb-20 bg-fff">
                <h3 class="m-aside-title border-dashed f-16 row justify-between">tag标签</h3>
                <p class="mt-10">
                    <a class="el-tag mr-5 mb-5" href="/">nodejs</a>
                    <a class="el-tag mr-5 mb-5" href="/">express</a>
                    <a class="el-tag mr-5 mb-5" href="/">mysql</a>
                    <a class="el-tag mr-5 mb-5" href="/">vue</a>
                    <a class="el-tag mr-5 mb-5" href="/">react</a>
                    <a class="el-tag mr-5 mb-5" href="/">javascript</a>
                    <a class="el-tag mr-5 mb-5" href="/">go</a>
                    <a class="el-tag mr-5 mb-5" href="/">java</a>
                    <a class="el-tag mr-5 mb-5" href="/">python</a>
                    <a class="el-tag mr-5 mb-5" href="/">css</a>
                    <a class="el-tag mr-5 mb-5" href="/">threejs</a>
                    <a class="el-tag mr-5 mb-5" href="/">pixi.js</a>
                    <a class="el-tag mr-5 mb-5" href="/">electron</a>
                </p>
            </section> -->

           
           
        </aside>

    </div>
</main>

<!-- footer -->
{{include './common/footer.html'}}

<!-- 返回顶部 -->
{{include './common/backtop.html'}}

{{include './common/js.html'}}
</body>

</html>